import {View, Button, Text, Image, ScrollView, Radio} from '@tarojs/components';
import Taro from '@tarojs/taro';
import React, {Component} from 'react';
import * as T from '../types';
import './memberCard.less';
import actions from '../actions/index';
import {connect} from 'react-redux';
import {store2Props} from '../selectors';
import uesrImg from '@/assets/image/my/uesr_pic.png';
import bannerBarImage from '@/assets/image/index/memberOpen/bannerImage.png';
interface ComponentState {
  newUserModel: boolean;
}

type ITopProps = T.IProps & T.ITopProps & ComponentState;
//@ts-ignore
@connect<Partial<ITopProps>, T.ITopState>(store2Props, actions)
export default class Info extends Component<Partial<ITopProps>, T.ITopState> {
  constructor(props: ITopProps) {
    super(props);
    this.state = {};
  }

  render() {
    let {
      actions: {action},
      main: {customer, memberCardType},
    } = this.props;
    let memberCardTypeName = '';
    if (memberCardType === 'noMember') {
      memberCardTypeName = '普通用户';
    }
    if (memberCardType === 'chijing') {
      memberCardTypeName = '赤晶会员';
    }
    if (memberCardType === 'shuangchong') {
      memberCardTypeName = '双重会员';
    }
    if (memberCardType === 'lanjing') {
      memberCardTypeName = '蓝晶会员';
    }
    return (
      <View className="renewalMember-memberCard">
        <View style={{flexDirection: 'row', alignItems: 'center'}}>
          <Image className="userHeader" src={customer?.pictureUrl ? customer?.pictureUrl : uesrImg} />
          <View>
            {customer && <Text className="userName">{customer.name}</Text>}
            <View className="userType">{memberCardTypeName}</View>
          </View>
        </View>
        <View className="bannerBar">
          <Image className="bannerBar-Image" src={bannerBarImage} />
          <Text className="text1">开通会员享特权</Text>
          <Text className="text1">多用多省 少用不亏</Text>
        </View>
      </View>
    );
  }
}
